/**
 * Created by Eric on 2017/12/11.
 *
 * 表格组件
 *      此组件必须引用bootstrap.css\jquery\font-awesome\summernote

 *  参数说明:
 *          @param {String} upLoadUrl  图片上传接口地址
 *          @param {String} content  获取编辑器内容
 *          @param {Integer} minHeight 编辑器最低高度
 *  使用方式:
 *      ex:<bg-editor 
                :minHeight="300" 
                :uploadUrl="uploadApi" 
                :content="getApi"
                @editorData='editorInfo'>
            </bg-editor>
 *       @editorData 取得编辑器内容
 *
 *
 */
<template>
  <div>
     <div :id="id"></div>
  </div>
</template>
<script>
let CONSTANT = require('../../constant/constant.js');
let common = require("../../common.js");
import $ from 'jquery'
export default {
    data(){
        return{}
    },
    props:{
        id:{
            type: String,
            default:'summernote'
        },
        canEdit:{
            type:Boolean,
            default:true
        },
        minHeight:{
            type: Number,
            default: 300
        },
        content:{
            type: String,
            default: ''
        }
    },
    watch:{
    },
    mounted() {
        setTimeout(()=>{
            $(`#${this.id}`).summernote('code',this.content)
        },1000)
       
        $(`#${this.id}`).summernote({
          toolbar: [
            //[groupName, [list of button]]
            ['style', ['bold', 'italic', 'underline', 'clear']],
            ['font', ['strikethrough', 'superscript', 'subscript']],
            ['fontsize', ['fontsize']],
            ['color', ['color']],
            ['para', ['ul', 'ol', 'paragraph']],
            ['height', ['height']],
            ['picture',['picture']],  
            ['table',['table']],
            ['fullscreen',['fullscreen']],
            ['codeview', ['codeview']],
            // ['help', ['help']]
          ],
          lang: 'zh-CN',
          minHeight: this.minHeight, // set editor height
          dialogsFade: true,
          lineNumbers:false,
          callbacks: {
            onImageUpload: (files) => {
                let file = files[0];
                let url = CONSTANT.URL.SYSTEM.ADMINUPLOADFILE + file.name.split(".")[1] + '?contentType=' +  file.type;
                //suffix:file.name.split(".")[1],   // 文件后缀  png
                //contentType:file.type             // 文件类型  image/png
                common.get(url,'',(res)=> {
                    let upLoadUrl = res.data.bussData.uploadUrl;
                    let downloadUrl =   res.data.bussData.downloadUrl;
                    common.uploadFile(upLoadUrl,file,file.type,(res)=>{
                        $(`#${this.id}`).summernote('editor.insertImage', downloadUrl);
                    })
                });    
            },
            onChange: (contents, $editable)=> {
                this.$emit('editorData',contents)
            }
          },
          content(item) {
            
          }
        })
        // if(!this.canEdit){
        //     //$('#summernote').summernote('enable');
        //     $('#summernote').summernote('disable');
        // }
    },
    methods:{
    }
}
</script>

<style lang="scss" scoped>
@import '/static/bootstrap.css'; 
@import '/sys/static/bootstrap.css'; 
</style>